﻿@{
    ViewBag.Title = "电话本列表";
    Layout = "~/Areas/IM/Views/Shared/_Layout.cshtml";
}
@section scripts{
    <script src="../Scripts/jquery.AnkeExtend.js"> </script> 
    <script type="text/javascript">
        //页面动态改动
        $(window).resize(function () {
            $.setGridWithSearchBar("#TableForm", "#SearchBar", "#grid");
        });

        //页面初始化
        $(document).ready(function () {
            DisableBackspace();
            $('#editWindow').window('close'); // 默认隐藏查看详细信息窗口
            //取电话分类
            $.EUIcombobox("#phoneType", {
                url: '@Url.Content("~/DD/TelBook/GetPhoneType/")',
                valueField: 'ID',
                textField: 'Name',
                editable: false,
                OneOption: [{
                    ID: "",
                    Name: "--请选择--"
                }]
            });

            bindGrid();
            $.setGridWithSearchBar("#TableForm", "#SearchBar", "#grid");
        })

        function bindGrid() {
            $('#grid').datagrid({
                width: 'auto',
                height: 'auto',
                fitColumns: true,
                striped: true,
                singleSelect: true,
                url: '@Url.Content("~/DD/TelBook/DataLoad")',
                loadMsg: '数据加载中请稍后……',
                pagination: true,//启用分页
                rownumbers: true,//显示页码
                pageSize: 15,//设置 页容量
                pageList: [10, 15, 20],//设置 页容量下拉框
                queryParams: {
                    phoneType: $('#phoneType').combobox('getValue'),
                    name: $('#name').textbox('getValue'),
                    phone: $('#phone').textbox('getValue')
                },
                columns: [[
                   { title: '名称', field: 'name', width: '15%', align: "center", sortable: false },
                   { title: '电话分类', field: 'phoneType', width: '20%', align: "center", sortable: false },
                   { title: '联系电话一', field: 'phone1', width: '10%', align: "center", sortable: false },
                   { title: '分机一', field: 'extension1', width: '10%', align: "center", sortable: false },
                   { title: '联系电话二', field: 'phone2', width: '10%', align: "center", sortable: false },
                   { title: '分机二', field: 'extension2', width: '10%', align: "center", sortable: false },
                   { title: '备注', field: 'remark', width: '24%', align: "center", sortable: false }
                ]],
                onLoadSuccess: function (data) { //add2023-08-07 plq 查询页 SQL 防注入提示
                    //console.log(data);
                    if (data.rows == "dangerousInfomation") {
                        $.messager.alert('提示', '输入内容不安全，请重新输入！', 'info');
                    }
                }
   
            })
            $.setGridWithSearchBar("#TableForm", "#SearchBar", "#grid");
        }

        //查询
        function reSearch() {
            $('#grid').datagrid({
                pageNumber: 1,//点击查询返回第一页
                queryParams: {
                    phoneType: $('#phoneType').combobox('getValue'),
                    name: $('#name').textbox('getValue'),
                    phone: $('#phone').textbox('getValue')
                }
            })
        }
    </script>
}
<div id="TableForm" class="easyui-layout" style="width:auto; height: auto; margin-left: auto; margin-right: auto">
    <div data-options="region:'center',title:'电话本列表',iconCls:'icon-custom-Entry'">
        <div id="SearchBar" data-options="region:'center'" style="overflow: hidden; padding: 10px">
            <table style="width:99%" cellpadding="0" cellspacing="5" border="0">
                <tr>
                    <td align="right" valign="middle" width="9%">电话分类：</td>
                    <td align="left" valign="middle" width="13%">
                        <input id="phoneType" class="easyui-combobox" style="width:150px" />
                    </td>
                    <td align="right" valign="middle" width="9%">名称：</td>
                    <td align="left" valign="middle" width="13%">
                        <input id="name" class="easyui-textbox" style="width:150px" />
                    </td>
                    <td align="right" valign="middle" width="9%">电话号码：</td>
                    <td align="left" valign="middle" width="13%">
                        <input id="phone" class="easyui-textbox" style="width:150px" />
                    </td>
                    <td align="center" valign="middle" width="11%">
                        <a href="javascript:void(0)" id="btnsearch" class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="reSearch()">查询</a>
                    </td>
                </tr>
            </table>
        </div>
        <div data-options="region:'center'" style="background: #fafafa; overflow: hidden">
            <table id="grid"></table>
        </div>
    </div>
</div>

